<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>行级元素的padding</title>
    <style type="text/css">
        p {
            width: 300px;
            height: 300px;
            background: deeppink;
            margin: 0;
        }

        span {
            padding: 50px 50px;
            background-color: rgba(33, 33, 33, 0.5);
        }
    </style>
</head>
<body>
<!-- 虽然padding所说的上下无效，但是从展示上面来说是有效的 -->
<div>从上面展示的效果上面就可以看到，行级元素其实是支持padding宽高的，但是这种padding宽高并不会去影响到整个布局界面的排布，也就是说对页面布局的影响是无效的，但是对自身的显示其实是有效的</div>
<p>行级元素的上一行元素p</p>
<span>我是一个span</span>
</body>
</html>